(function() {
	var canvas = document.getElementById("demo-canvas2");
	var context = canvas.getContext("2d");
	var width = window.innerWidth ;
	var height = window.innerHeight / 1.18;
	canvas.width = width;
	canvas.height = height;
	var arr = [];
	init();

	function init() {
		setInterval(setArrAndModel, 500);
	}

	function setArrAndModel() {
  		context.clearRect(0,0,width,height);
		var mo = new Model(Math.random() * width, Math.random() * height, Math.random()*20);
		arr.push(mo);
		for(var i=0;i<arr.length;i++){
			var moo=arr[i];
			moo.create();
			
		}
		
		if(arr.length>5){
			arr.shift();
		}
	}

	/**
	 * 
	 * @param {Object} xPot x轴
	 * @param {Object} yPot y轴
	 * @param {Object} radius 半径
	 */
	function Model(xPot, yPot, radius) {
		this.xPot = xPot;
		this.yPot = yPot;
		this.radius = radius;

		this.create = function() {
			context.fillStyle = "#E3E3E3";
			context.beginPath();
			context.arc(xPot, yPot, radius, 0, Math.PI * 2, true);
			context.closePath();
			context.fill();
		}

		this.update = function() {
			this.xPot += 10;
			this.yPot += 10;
		}
	}
})();